
var CustomersListView = new function () {
    
    this.View = "#customers_content";
    this.IsRendered = false;
	
    var root = this;
    
    var htmlCustomerTemplate = GetTemplateByName('Customer');
    var htmlCustomerListTemplate = GetTemplateByName('CustomerList');

	
    this.RenderView = function() {
        
        if (!this.IsRendered) { // || CustomerService.HasChanged()) {
            // Status tonen
            SetStatus("loading");
            
            // Asynchroon functie starten om view aan te maken
            setTimeout(function () {root.RenderPartialView.apply(root)}, 100);
        }
    }
    
    this.RenderPartialView = function(CustomerList) {
        air.trace("CustomersListView: Rendering Customer view");
    
        // Alle klanten overlopen in de lijst
        // en elke klant renderen in html
        customers_html = '';
        for (var id in CustomerService.Customers) {
            customers_html += this.RenderCustomerView(CustomerService.Customers[id]);
        }
        
        customers_html = htmlCustomerListTemplate.replace(/{CUSTOMER_HOOK}/g, customers_html);
       
		// html renderen
        $(this.View).html(customers_html);
        
        // Accordeon activeren
        $("#customer_list").accordion({
            autoHeight: false,
            collapsible: true,
            header: "h3", 
            active: -1
        });
        
        this.IsRendered = true;
        
        // Status resetten
        SetStatus("none");
    }
    
    
    this.RenderCustomerView = function (customer) {
        var customer_html = htmlCustomerTemplate;
        
        customer_html = customer_html.replace(/{ID_HOOK}/g, customer.ID);
        customer_html = customer_html.replace(/{NAME_HOOK}/g, customer.Name());
        customer_html = customer_html.replace(/{EMAIL_HOOK}/g, customer.Email);
        customer_html = customer_html.replace(/{UPDDATE_HOOK}/g, customer.DateUpdated);
        customer_html = customer_html.replace(/{GENDER_HOOK}/g, customer.Gender == 1 ? "male" : "female");
        customer_html = customer_html.replace(/{DOB_HOOK}/g, customer.Birthday);
        
        var add = customer.Address();
        
        if (add != undefined) {
            customer_html = customer_html.replace(/{ADDRESS_ALIAS_HOOK}/g, add.Alias);
            customer_html = customer_html.replace(/{ADDRESS_1_HOOK}/g, add.Address1);
            customer_html = customer_html.replace(/{ADDRESS_2_HOOK}/g, add.Address2);
            customer_html = customer_html.replace(/{ADDRESS_POSTCODE_HOOK}/g, add.Postcode);
            customer_html = customer_html.replace(/{ADDRESS_CITY_HOOK}/g, add.City);
            
            customer_html = customer_html.replace(/{ADDRESS_PHONE_HOOK}/g, add.Phone);
            customer_html = customer_html.replace(/{ADDRESS_MOBILE_PHONE_HOOK}/g, add.MobilePhone);
        }
        
        return customer_html;
    }
}